<template>
<!-- 扫码购药 --确认生成订单页面 -->
<view>
    <!-- liebiao待多久密码 -->
    <view class="marginTop">
        <uni-list>
            <uni-list-item title="收货方式" style="font-size: 29rpx;" rightText="配送" />
            <uni-list-item title="支付方式" style="font-size: 29rpx;" rightText="在线支付" />
        </uni-list>
    </view>

    <view class="addressTop">
        <uni-list>
            <!-- <view style="color:#FF5100;font-size: 40rpx; position:">*</view> -->
            <uni-list-item v-if="addressList.length > 0" showArrow title="收货地址" link to="/pagesSub-My/my/addressList" />
            <!-- getMapLocation -->
            <!-- <uni-list-item v-if="addressList.length > 0" showArrow title="收货地址" @click="getMapLocation" /> -->
            <uni-list-item v-if="addressList.length < 1" showArrow title="收货地址" link to="/pagesSub-My/my/addressList" rightText="未添加,点击去添加" />
            <view class="drugsInfo" v-if="addressList.length > 0">
                <h4 style="font-size: 29rpx;">{{ userName || '' }}</h4>
                <view class="gray_font">
                    <text style="font-size: 29rpx;" class="rightMargin">
                        {{ phone || '' }}
                    </text>
                </view>
                <view class="gray_font">
                    <text style="font-size: 29rpx;">{{ addressAll || '' }}</text>
                </view>
            </view>
            <!-- <uni-list-item  :title="address" /> -->
        </uni-list>
    </view>
    <!-- 发票 -->
    <view class="marginTop invoiceTop">
        <uni-list>
            <uni-list-item title="发票" showArrow :rightText="rightTxt" link="redirectTo" to="" @click="openInvoicePopup" />
            <view class="" style="padding: 10rpx 30rpx 30rpx;" v-if="invoiceFlag">
                <view class="orderPrice">
                    <text>
                        发票抬头：{{ checkType == 1 ? invoiceName : invoiceComName }}
                    </text>
                </view>
                <view class="orderPrice" v-if="invoiceFlag && checkType == 2">
                    <text>纳税人识别号：{{ invoiceNumber || '' }}</text>
                </view>
            </view>
        </uni-list>
    </view>
    <!-- 药品信息 -->
    <view class="marginTop">
        <uni-list>
            <uni-list-item title="药品信息" />
            <view class="drugsInfo" v-for="(item, index) in drugsList" :key="index">
                <h4>{{ item.drugName || '' }}</h4>
                <view class="gray_font">
                    <!-- /***/checked: true

dosageUnit: "瓶"

drugCount: 1

drugId: 1

drugImg: null

drugName: "药品名112"

drugPrice: 0.01

drugSpecification: "使用规格111"

factoryName: "生产厂家111"

retailUnit: "ml" -->
                    <text class="rightMargin">{{ item.drugSpecification || '' }}</text>
                    <!-- 零售单位：丸剂、ml -->
                    <text class="rightMargin">{{ item.retailUnit }}</text>
                    <text class="rightMargin">{{ item.factoryName || '' }}</text>
                </view>
                <view class="gray_font" style="display: flex; justify-content: space-between;">
                    <text class="greenColor">
                        {{ item.drugPrice }}元/{{ item.dosageUnit }}
                    </text>
                    <text>x{{ item.drugCount || '0' }}{{ item.dosageUnit }}</text>
                </view>
            </view>
        </uni-list>
    </view>
    <!-- 订单金额 -->
    <view class="marginTop orderAmount marginBottom">
        <uni-list>
            <uni-list-item title="订单金额" />
            <!-- <uni-list-item title="商品金额" class="fontTxt"  :rightText="allPrice" />

<uni-list-item title="配送费" class="fontTxt" rightText="0元" /> -->
            <view class="orderPrice">
                <view class="fontTxt" style="display: flex; justify-content: space-between;">
                    <text class="">商品金额</text>
                    <text class="greenColor" style="font-weight: 900;">
                        {{ allPay }}元
                    </text>
                </view>
                <view class="fontTxt" style="display: flex; justify-content: space-between;">
                    <text class="">配送费</text>
                    <text class="greenColor" style="font-weight: 900;">
                        {{ configValue || '0' }}元
                    </text>
                </view>
            </view>
        </uni-list>
    </view>

    <uni-popup ref="invoicePopup" type="bottom" :mask-click="false" style="z-index: 99;">
        <view class="preview_content">
            <view class="title-wrap">
                <view class="title">发票</view>

                <view class="icon_close">
                    <image @click="closeInvoice" style="
                width: 50rpx;
                height: 50rpx;
                float: right;
                margin-top: -60rpx;
              " src="../static/images/icon_close_gray.png"></image>
                </view>
            </view>

            <view>
                <view class="flex">
                    <span style="font-weight: 800;">开具发票</span>
                    <switch :checked="isChecked" color="#4cd964" style="margin-top: -8rpx; transform: scale(0.7);" @change="changeInvoice" />
                </view>
                <!-- <button @click="finish" class="arc_button btn_pro" type="primary">完成</button> -->
                <view v-if="isChecked">
                    <view class="flex fontSize title-wrap" style="padding-bottom: 20rpx;">
                        <span>发票类型</span>
                        <span class="gray_font">普通发票</span>
                    </view>
                    <view class="fontSize" style="margin: 10rpx 0;">发票抬头</view>
                    <view class="">
                        <uni-tag class="tagInfo" :circle="true" size="small" :inverted="invertedPerson" text="个人" type="success" @click="setInverted(1)"></uni-tag>
                        <uni-tag class="tagInfo" text="公司" size="small" :circle="true" :inverted="invertedCom" type="success" @click="setInverted(2)"></uni-tag>
                    </view>
                    <view class="" v-if="!invertedCom">
                        <view class="" style="display: flex;">
                            <view style="
                    color: #ff5100;
                    font-size: 40rpx;
                    margin-right: 5rpx;
                    margin-top: 9rpx;
                  ">
                                *
                            </view>
                            <uni-easyinput style="width: 100%; font-size: 29rpx;" v-model="invoiceComName" type="text" placeholder="请填写单位名称" />
                        </view>
                        <view style="margin-top: 10rpx;">
                            <view class="" style="display: flex;">
                                <view style="
                      color: #ff5100;
                      font-size: 40rpx;
                      margin-right: 5rpx;
                      margin-top: 9rpx;
                    ">
                                    *
                                </view>
                                <uni-easyinput style="width: 100%; font-size: 29rpx;" v-model="invoiceNumber" type="text" placeholder="请填写纳税人识别号" />
                            </view>
                        </view>
                    </view>

                    <view class="" v-if="!invertedPerson">
                        <view class="" style="display: flex;">
                            <view style="
                    color: #ff5100;
                    font-size: 40rpx;
                    margin-right: 5rpx;
                    margin-top: 9rpx;
                  ">
                                *
                            </view>
                            <uni-easyinput style="width: 100%; font-size: 29rpx;" v-model="invoiceName" type="text" placeholder="请填写开具发票人的姓名" />
                        </view>
                    </view>
                </view>
                <!--background: -webkit-linear-gradient(#77E2A4, #4CCDBC); -->
                <button type="default" style="
              background-color: #4cd964;
              position: fixed;
              bottom: 10rpx;
              width: 90%;
              color: #ffffff;
              font-size: 14px;
              margin: 10rpx 0 10rpx 10rpx;
              display: inline-block;
            " @click="clickConfirm">
                    确定
                </button>
            </view>
        </view>
    </uni-popup>

    <view class="footer pad30">
        <view class="" style="text-align: right; margin-top: 5px; line-height: 50px;">
            <text>
                总价：
                <text class="greenColor" style="font-weight: 900;">
                    {{ allPrice }}元
                </text>
            </text>
        </view>
        <view>
            <button style="
            background: -webkit-linear-gradient(#77e2a4, #4ccdbc);
            width: 185rpx;
            color: #ffffff;
            line-height: 80rpx;
            font-size: 30rpx;
            margin: 10rpx 0 10rpx 10rpx;
            display: inline-block;
          " type="default" @click="payfor">
                生成订单
            </button>
        </view>
    </view>
</view>
</template>

<script>
import store from '@/store';

import {
    addressList
} from '@/api/prescribing.js'
import {
    // drugInfo,
    toPayfor,
    // distributionFee, //查询配送费
} from '@/api/my.js'
// import {
//     wechatOrderPay,
//     consultOrderInfo,
//     paySuccess
// } from '@/api/consult.js'
import {
    // medicalOrder,
    getFreight  //查询配送费
} from '@/api/order.js';
import {
    openOrderPaySubscribe
} from '@/utils/SubscribeMessage.js'
export default {
    data() {
        return {
            orderValue: '', //支付方式
            configValue: '', //配送费
            invoiceFlag: false, //发票信息填写完整
            rightTxt: '暂不需要', //发票右边文字
            invertedPerson: true, //false--选中
            invertedCom: true,
            invoiceName: '',
            invoiceComName: '',
            invoiceNumber: '',
            checkType: '', //发票类型
            isChecked: false, //开具发票是否选中
            orderId: 0, //订单id
            orderInfo: {}, //订单信息
            prescriptionId: 0, //处方id
            allPrice: '', //总价格
            allPay: '', //商品总金额
            drugsList: [], // 药品信息
            addressList: [], //地址列表
            addressAll: '', // 完整地址= this.addressList[0].province + this.addressList[0].city + this.addressList[ 0] .region + this.addressList[0].address;
            addressProvince: '', // 省 = this.addressList[0].province;
            addressCity: '', //  市= this.addressList[0].city;
            addressDistrict: '', //区 = this.addressList[0].region;
            address: '', // 详细地址
            phone: '',
            userName: '',
        }
    },
    onLoad(option) {
        // if(option){
        this.prescriptionId = option.drugId || 18
        this.patientId = option.patientId || 15
        this.drugsList = JSON.parse(decodeURIComponent(option.item)) //数据药品
        let allPrice = 0
        // 传过来的数据中重新计算总价，以防直接取总价可能为0
        this.drugsList.reduce((pre, cur) => {
            allPrice =
                pre +
                Number(((cur.drugCount * cur.drugPrice * 10000) / 10000).toFixed(2))
            return (allPrice = Number(allPrice.toFixed(2)))
        }, 0)
        this.allPay = Number(allPrice) || Number(option.price) // 商品总金额
        console.log(this.allPrice, this.configValue, '111onload总价')

        // if(option.id){//订单id
        // 	this.orderIdItem = option.id
        // }else{
        // 	//@todo 暂时写死
        // 	this.orderIdItem = 134
        // }
    },

    onShow() {
        this.getAddressList() // H获取地址
        // this.getDistributionFee() //配送费

    },
    methods: {
        // getDistributionFee() {
        //     uni.showLoading({
        //         title: '加载中',
        //     })
        //     distributionFee()
        //         .then((res) => {
        //             console.log(res, '配送费')
        //             this.configValue = res.data.configValue
        //             this.allPrice = Number(this.allPay) + Number(this.configValue) //加上配送费的总价
        //             console.log(this.allPrice, this.configValue, '总价')
        //             uni.hideLoading()
        //         })
        //         .catch((err) => {
        //             uni.hideLoading()
        //             console.log(err, '配送费err')
        //         })
        // },
        /**

 * isBill	string		必须

是否需要发票0需要 1不需要		billType	string		必须

发票类型(1个人,2企业)		rise	string		必须

发票抬头(类型为个人时填写)		unitName	string		必须

单位名称(企业类型填写)		taxPayerNo	string		必须

纳税人识别号(企业类型填写)

*/
        // 发票的确定按钮
        clickConfirm() {
            if (this.isChecked) {
                // 开具发票按钮为选中
                if (this.checkType == 1) {
                    // 个人
                    if (this.invoiceName) {
                        this.rightTxt = '普通发票-个人'
                        this.invoiceFlag = true
                        // console.log(this.invoiceName, this.checkType, '99999999invoiceName')
                        this.closeCf()
                    } else {
                        uni.showToast({
                            title: '请填写发票抬头',
                            icon: 'none',
                            duration: 3000,
                        })
                    }
                } else if (this.checkType == 2) {
                    // 公司
                    if (this.invoiceComName && this.invoiceNumber) {
                        this.invoiceFlag = true
                        this.rightTxt = '普通发票-公司'
                        this.closeCf()
                    } else {
                        uni.showToast({
                            title: '请填写发票信息',
                            icon: 'none',
                            duration: 3000,
                        })
                    }
                    // this.rightTxt = '普通发票-公司'
                }
            } else {
                this.invoiceFlag = false
                // this.isChecked=false;
                this.rightTxt = '暂不需要'
                this.closeInvoice()
            }
        },
        setInverted(type) {
            // type=1--个人 2--公司
            this.invoiceFlag = false
            if (type == 1) {
                this.checkType = '1'
                this.invertedPerson = false
                this.invertedCom = true
            } else {
                this.checkType = '2'
                this.invertedPerson = true
                this.invertedCom = false
            }
            // console.log(this.invertedPerson, this.invertedCom, '个人和公司 ---')
        },
        // 开具发票按钮
        changeInvoice(e) {
            this.isChecked = e.target.value
            if (e.target.value) {
                this.checkType = '1' //类型是个人
                this.invertedPerson = false //开发票按钮打开后默认将个人按钮选中
                this.invertedCom = true //开发票按钮打开后默认不选中公司
            } else {
                this.invoiceFlag = false
                this.rightTxt = '暂不需要'
                // this.closeInvoice()
            }
        },
        // 发票弹框
        openInvoicePopup() {
            this.$refs.invoicePopup.open('bottom')
        },

        //关闭发票
        closeCf() {

            this.$refs.invoicePopup.close()
        },
        closeInvoice() {
            this.invoiceName = ''
            this.invoiceNumber = ''
            this.invoiceComName = ''
            this.isChecked = false;
            this.invoiceFlag = false; // 发票信息是否展示
            this.closeCf();
        },
        // 获取地址信息
        getAddressList() {
            uni.showLoading({
                title: '加载中',
            })
            addressList()
                .then((res) => {
                    this.addressList = res.rows
                    if (this.addressList.length > 0) {
                // // 重新修改地址
                // let pages = getCurrentPages();  //获取所有页面栈实例列表
                // let nowPage = pages[ pages.length - 1];  //当前页页面实例
                // // let prevPage = pages[ pages.length - 2 ];  //上一页页面实例
                // // prevPage.address= item;   //修改上一页data里面的name参数值为1211
                // console.log(nowPage,'重新选的地址')
                // if(nowPage.address){
                //     this.provinces=[]
                //     this.provinces.push(nowPage.address)
                // }
                // console.log(this.provinces,'999999')

                        this.addressAll =
                            // this.addressList[0].province +
                            // this.addressList[0].city +
                            this.addressList[0].region +
                            this.addressList[0].address
                        // this.addressProvince = this.addressList[0].province
                        // this.addressCity = this.addressList[0].city
                        this.addressDistrict = this.addressList[0].region
                        this.address = this.addressList[0].address //具体地址
                        this.userName = this.addressList[0].name
                        this.phone = this.addressList[0].phone

                        // 查运费
                        // 查询运费
                        // freight() {
                        var obj = {
                            longitude: this.addressList[0].longitude,
                            latitude: this.addressList[0].latitude,
                            recieveName: this.userName,
                            recievePhone: this.phone,
                            recieveAddress: this.addressDistrict,
                            storeId: store.state.app.storeId //药店id
                        }
                        console.log(obj, '入参999---')
                        getFreight(obj).then(res => {
                            console.log(res, 'res运费结果')
                            if (res.code == 200) {
                                this.configValue = res.data.deliveryFee,  //配送费
                                this.allPrice = Number(this.configValue) + Number(this.allPay); //实付款 合计

                            } else {
                                this.$util.Tips({
                                    title: res.msg,
                                    icon: 'none',
                                    duration: 3000
                                })
                            }
                        }).catch(err => {
                            this.$util.Tips({
                                title: err,
                                icon: 'none',
                                duration: 3000
                            })
                        })
                    }

                    uni.hideLoading()
                })
                .catch((err) => {
                    uni.hideLoading()
                    uni.showToast({
                        title: err,
                        icon: 'none',
                        duration: 3000,
                    })
                })
        },
        // 去支付
        payfor() {
            let drugIds =
                this.drugsList &&
                this.drugsList.map((item) => {
                    return Number(item.drugId)
                })
            if (this.addressList.length > 0) {
                let param = {
                    deliveryFee: this.configValue, // 配送费
                    longitude: this.addressList[0].longitude,
                    latitude: this.addressList[0].latitude,
                    id: Number(this.prescriptionId),
                    patientId: Number(this.patientId),
                    drugIds: drugIds,
                    // 选择地址后获取
                    userName: this.userName || '',
                    phone: this.phone || '',
                    address: this.address || '',
                    // addressProvince: this.addressProvince || '',
                    // addressCity: this.addressCity || '',
                    addressDistrict: this.addressDistrict || '',
                    isBill: this.invoiceFlag ? '0' : '1',
                }
                if (this.invoiceFlag == true) {
                    param.billType = this.checkType || ''
                    if (param.billType == '1') {
                        //billType  (1个人,2企业)
                        param.rise = this.invoiceName || ''
                    } else {
                        param.unitName = this.invoiceComName || ''
                        param.taxPayerNo = this.invoiceNumber || ''
                    }
                }
                openOrderPaySubscribe()
                    .then((res) => {
                        uni.showLoading({
                            title: '加载中',
                        })
                        // 添加成功  生成订单
                        toPayfor(param)
                            .then((res) => {
                                if (res.code == 200) {
                                    this.orderInfo = res.data
                                    this.$set(this, 'orderInfo', res.data)
                                    // console.log(this.orderInfo, '添加成功  生成订单 topayfor')
                                    // this.getOrderPay(res.data); //调用微信支付
                                    // 跳转到支付页面，参数要将orderID传过去
                                    uni.redirectTo({
                                        url: `/pagesSub/homePage/prescribing/order?item=${res.data.id}`,
                                    })
                                }
                                uni.hideLoading()
                            })
                            .catch((err) => {
                                uni.hideLoading()
                                uni.showToast({
                                    title: err,
                                    icon: 'none',
                                    duration: 3000,
                                })
                                if (err.indexOf('未实名') != -1) {
                                    // console.log('没有实名')
                                    // return
                                    uni.navigateTo({
                                        url: `/pagesSub-My/my/editPatients?patientId=${this.patientId}`,
                                    })
                                }
                            })
                        // saveConsult(_this.valiFormData).then(res => {
                        // 	uni.hideLoading()
                        // 	_this.$util.Prom(res.code,res.msg);
                        // 	let id= res.data.id
                        // 	if(id){
                        // 		// let items = encodeURIComponent(JSON.stringify(res.data))
                        // 		// uni.navigateTo({
                        // 		// 	url:`/pages/index/consulOrder?items=${items}`
                        // 		// })
                        // 		setTimeout(function() {
                        // 		uni.redirectTo({
                        // 		url: `./consulOrder?id=${id}`
                        // 		})
                        // 		}, 2000);
                        // 	}else{
                        // 		uni.showToast({
                        // 		title: '添加失败！',
                        // 		icon: 'none',
                        // 		duration: 3000
                        // 		});
                        // 	}

                        // }).catch(err => {
                        // 	uni.hideLoading()
                        // 	_this.$util.Prom(500,err);
                        // 	console.log('err', err);
                        // });
                    })
                    .catch((err) => {
                        console.log(err)
                    })
            } else {
                // this.address = ''
                return uni.showToast({
                    title: '未填写地址，请先添加地址',
                    icon: 'none',
                    duration: 3000,
                })
            }
        },

        // getOrderPay(data) {
        //     let _this = this;
        //     let goPages = '/pages/index/index';
        //     uni.showLoading({
        //         title: '加载中'
        //     })
        //     console.log(_this.orderId, data.id, 'wechatorderpay999----')
        //     wechatOrderPay({
        //         orderId: data.id,// _this.orderInfo.id, // 134,
        //         spbillCreateIp: '', // '192.168.3.117'
        //     }).then(res => {
        //         let jsConfig = res.data;
        //         // debugger
        //         uni.requestPayment({
        //             provider: 'wxpay',
        //             timeStamp: jsConfig.timeStamp,
        //             nonceStr: jsConfig.nonceStr,
        //             package: jsConfig.package
        //             signType: jsConfig.signType,
        //             paySign: jsConfig.paySign,
        //             // ticket: _this.productType==='normal'? null : jsConfig.ticket,
        //             success: function(ress) {
        //                 // console.log(_this.orderInfo.id, data.id,  ress,'调用wechat钱huidiao9999----')
        //                 // wechatQueryPayResult(orderNo).then(res => {
        //                     // uni.hideLoading();
        //                     // uni.hideLoading();
        //                     uni.showLoading({
        //                         title: '回调中'
        //                     })
        //                     paySuccess(data.id).then(res=> {
        //                         // console.log('huidiao成功9999----')
        //                         uni.hideLoading();
        //                         return _this.$util.Tips({
        //                             title: '支付回调成功',
        //                             icon: 'success'
        //                         }, {
        //                             tab: 5,
        //                             url: goPages
        //                         });
        //                     }).catch(err => {
        //                         uni.hideLoading();
        //                         return _this.$util.Tips({
        //                             title: err
        //                         });
        //                     })
        //                 // })

        //             },
        //             fail: function(e) {
        //                 uni.hideLoading();
        //                 return _this.$util.Tips({
        //                     title: '取消支付'
        //                 }, {
        //                     tab: 5,
        //                     url: goPages + '&status=2'
        //                 });
        //             },
        //             complete: function(e) {
        //                 uni.hideLoading();
        //                 //关闭当前页面跳转至订单状态
        //                 if (e.errMsg == 'requestPayment:cancel') return _this.$util
        //                     .Tips({
        //                         title: '取消支付'
        //                     }, {
        //                         tab: 5,
        //                         url: goPages + '&status=2'
        //                     });
        //             },
        //         })
        //     }).catch(err => {
        //         console.log(err,'支付88err0----')
        //         uni.hideLoading();
        //         return _this.$util.Tips({
        //             title: err
        //         });
        //     });
        // },
    },
}
</script>

<style lang="scss" scoped>
.marginTop {
    margin-top: 20rpx;
}

.marginBottom {
    margin-bottom: 220rpx;
}

.addressTop {
    margin-top: 20rpx;
}

.drugsInfo {
    border-top: 1px solid #f6f6f6;
    padding: 20rpx 30rpx;
}

.drugsInfo h4 {
    // font-size: 14px;
    font-size: 29rpx;
}

.drugsInfo text {
    // font-size: 14px;
    font-size: 28rpx;
    margin: 3px 10rpx 3px 0;
}

.rightMargin {
    margin-right: 10rpx;
}

.fontTxt {
    /* line-height: 25px; */
    padding: 20rpx 30rpx;
    border-bottom: 1px solid #f6f6f6;
}

.orderPrice text {
    font-size: 28rpx;
}

.greenColor {
    color: #4cccbf;
}

/deep/.addressTop .uni-list-item__extra-text {
    color: #4cccbf;
}

/* /deep/.invoiceTop .uni-list-item__extra-text {

color: #4CCCBF;

} */

/deep/.orderAmount .uni-list-item__extra .uni-list-item__extra-text {
    color: #4cccbf;
}

.footer {
    padding-top: 10rpx;
    position: fixed;
    bottom: 0;
    width: 92%;
    background-color: #ffffff;
    padding-bottom: 30rpx;
    display: flex;
    justify-content: space-between;
    z-index: 9;
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
    box-sizing: content-box;
}

.preview_content {
    background-color: #ffffff;
    padding: 30rpx;
    height: 290px;
    /* 	border-top-right-radius: 40rpx;

border-top-left-radius: 40rpx; */
}

.preview_content>.title {
    /* text-align: center; */
    font-size: 30rpx;
}

.title-wrap {
    border-bottom: 1px solid #f7f7f7;
}

.title-wrap>.title {
    padding-bottom: 20rpx;
    font-weight: 800;
}

.flex {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
}

.fontSize {
    font-size: 14px;
}

.tagInfo {
    cursor: pointer;
    margin-right: 10rpx;
    font-size: 10px;
    height: 60rpx;
    padding: 0;
    /* width: 50px;
    text-align: center */
    /* background-color: #0CB56A; */
    /* color: #FFFFFF; */
    display: inline-block;
}

/deep/.uni-list-item__extra-text {
    font-size: 30rpx;
}

/deep/.uni-list-item__content-title {
    font-size: 32rpx;
}

.card_content {
    background-color: #ffffff;
    padding: 30rpx;
    //   margin: 30rpx;
    //   border-radius: 10rpx;
}

.personal_info {
    display: flex;
    justify-content: space-between;
    font-size: 26rpx;
    padding: 30rpx;
    background-color: #ffffff;
}

.specification {
    font-size: 30rpx;
    margin-top: 10rpx;
}
</style>
